<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Title</title>
  <style>
    [v-cloak]{
        display:none;
    } /*当你有v-cloak这个属性时，display显示：none*/
  </style>
</head>
<body>
<div id="app">
  <!--v-cloak指令（很少用）：当有延迟时，我们浏览器可以会直接显示出未编译的mustache标签
                  在vue解析之前，h2中有一个属性v-cloak
                  在vue解析之后，h2中没有一个属性v-cloak，被删除了 -->
  <h2 v-cloak>{{message}}</h2>
</div>

<script src="../js/vue.js"></script>
<script>
  setTimeout(function(){
    const app=new Vue({
      el: '#app',
      data: {
        message: '你好'
      },
    })
  },1000) //setTimeout(function(),1000)将代码延迟一秒钟

</script>
</body>
</html>